<template>
    <!-- use the modal component, pass in the prop -->
    <modal v-if="stateManager.editDialogVisible"
           @cancel="closeDialog"
           @ok="closeDialog"
           :saveButton="false"
           :modal-title="modalTitle"
           model-size="normal">
        <!--
          you can use custom content here to overwrite
          default content
        -->
        <div class="row">
            <div class="col-xs-12">
                <div class="table-responsive">
                    <table class="table table-striped">
                        <tbody>
                        <tr>
                            <td>姓名</td>
                            <td>{{model.xm}}</td>
                        </tr>
                        <tr>
                            <td>学号</td>
                            <td>{{model.xh}}</td>
                        </tr>
                        <tr>
                            <td>性别</td>
                            <td>{{model.xbm}}</td>
                        </tr>
                        <tr>
                            <td>出生日期</td>
                            <td>{{model.csrq}}</td>
                        </tr>
                        <tr>
                            <td>身份证号</td>
                            <td>{{model.sfzjh}}</td>
                        </tr>
                        <tr>
                            <td>民族</td>
                            <td>{{model.nation?model.nation.value:'无'}}</td>
                        </tr>
                        <tr>
                            <td>政治面貌</td>
                            <td>{{model.political?model.political.value:'无'}}</td>
                        </tr>
                        <tr>
                            <td>学院</td>
                            <td>{{model.school}}</td>
                        </tr>
                        <tr>
                            <td>学制类型</td>
                            <td>{{model.type}}</td>
                        </tr>
                        <tr>
                            <td>班级</td>
                            <td>{{model.ywb}}</td>
                        </tr>
                        <tr>
                            <td>联系方式</td>
                            <td>{{model.lxdh}}</td>
                        </tr>
                        <tr>
                            <td>专业</td>
                            <td>{{model.zyfx}}</td>
                        </tr>

                        <tr>
                            <td>学籍校</td>
                            <td>{{model.xsh}}</td>
                        </tr>
                        <tr>
                            <td>认证状态</td>
                            <td>{{statusArr[model.status]}}</td>
                        </tr>
                        <tr v-show="model.status == 3">
                            <td>提交修正信息</td>
                            <td>{{model.update_desc}}</td>
                        </tr>

                        </tbody>
                    </table>
                </div>
            </div>
        </div>


    </modal>


</template>

<script>
  export default {
    props: {
      stateManager: {
        type: Object,
      },
    },
    data: function () {
      return {
        model: this.$modelDataSource({
          url: 'api/backend-student-info',
          dataKey: 'model',
          attributes: {
            id: 0,
            xm: '',
            xh: '',
            xbm:''
          },
        }),
        statusArr: {
          1: '尚未认证',
          2: '确认吻合',
          3: '提交修正',
        },
      }
    },
    methods: {
      closeDialog: function () {
//                console.log(11);
        this.stateManager.editDialogVisible = false
      },
      validate: function (successCallback, failedCallback) {
        this.$validator.validateAll().then(() => {
          // eslint-disable-next-line
          console.log('验证通过')
          typeof successCallback === 'function' && successCallback()
        }).catch(() => {
          // eslint-disable-next-line
          console.log('验证未通过')
          typeof failedCallback === 'function' && failedCallback()
        })

      },
    },
    computed: {
      modalTitle: function () {
        return '学生详细信息查看'
      },
    },
    watch: {
      'stateManager.editModelId': function (newValue) {
        this.model.fetch(newValue)
      },
    },
  }
</script>